<!-- 快速评估小模块 -->
<template>
  <div class="assessment-container">
    <div class="rapid-title">{{ dataItem?.diseaseType?.name }}</div>
    <div class="rapid-text">
      {{ dataItem?.diseaseType?.remark }}
    </div>
    <div class="rapid-box">
      <div v-for="(item, index) in dataItem?.questionList || []" :key="index">
        {{ item?.remark }}
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { AssessmentVO } from "@/api/ai/assessment/types";

const props = defineProps({
  data: {
    type: Object,
    default: () => {
      return {};
    },
  },
});

const dataItem = ref<AssessmentVO>(props.data);
</script>

<style lang="scss" scoped>
.assessment-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  font-size: var(--el-font-size-base);

  .rapid-title {
    font-size: calc(var(--el-font-size-base) + 4px);
    color: $main-text;
  }

  .rapid-text {
    opacity: var(--el-text-dark-opacity);
    line-height: 22px;
    margin: 5px 0;
  }

  .rapid-box {
    width: 100%;
    height: 91px;
    border-radius: 12px 12px 12px 12px;
    padding: 16px 6px;
    color: #8cb3ff;
    line-height: 22px;
    margin-bottom: 5px;
    background: rgba(84, 117, 248, 0.3);
  }
}
</style>
